* {
    padding: 0;
    margin: 0;
    font-size: 12px;
    /*box-sizing: padding-box;
    /*font-style: al;*/
    /*min-width: 1950px;*/*/
}

li {
    list-style: none;
}

a {
    color: #ccc;
    text-decoration: none;
}


/*-------------------通用--------------*/


/*头部-顶部*/

header .header-top {
    height: 36px;
    width: 100%;
    background-color: #545652;
}


/*top中间的内容*/

header .header-top .warp-center {
    width: 1150px;
    height: 100%;
    margin: 0 auto;
    position: relative;
}


/*左边的下拉列表*/

header .header-top .warp-center span {
    color: #fff;
    line-height: 36px;
    padding: 10px 15px 12px 15px;
}

header .header-top .warp-center span i {
    display: inline-block;
    width: 20px;
    height: 12px;
    background-image: url(../images/ico_arr.png);
    background-repeat: no-repeat;
    background-position: -27px -54px;
}

header .header-top .warp-center span:hover {
    background-color: #fff;
    color: #E64E3E;
    border-top: 2px solid #E64E3E;
}

header .header-top .warp-center span:hover>ul {
    display: block;
    border-top: 0px;
}


/*这是下拉列表选项*/

header .header-top .warp-center ul {
    position: absolute;
    border: 1px solid #ccc;
    background-color: #fff;
    display: none;
}

header .header-top .warp-center ul li {
    color: #7a7676;
}

header .header-top .warp-center ul li a {
    display: inline-block;
    padding: 0px 0;
    color: #7a7676;
    width: 100px;
    text-align: center;
}

header .header-top .warp-center ul li a:hover {
    background-color: #EEEEEE;
}

header .header-top .warp-center span:last-of-type ul {
    transform: translate(91px, 0px);
}


/*top右边的*/

header .header-top .warp-center .top-right {
    float: right;
    height: 100%;
    width: 320px;
}

header .header-top .warp-center .top-right div {
    display: inline-block;
    line-height: 36px;
}

header .header-top .warp-center .top-right div:first-of-type i {
    display: inline-block;
    height: 14px;
    width: 18px;
    background-image: url(../images/iconsb.png);
    background-repeat: no-repeat;
    background-position: -118px 0;
    vertical-align: middle;
}

header .header-top .warp-center .top-right div:last-of-type {
    /*border: 1px solid #000;*/
    background-color: #fff;
    width: 224px;
    height: 26px;
    vertical-align: middle;
    overflow: hidden;
    margin-left: 20px;
}

header .header-top .warp-center .top-right div:last-of-type input {
    border: 0px;
    height: 26px;
    position: relative;
    top: -7px;
    padding: 8px;
    outline: none;
    width: 180px;
}

header .header-top .warp-center .top-right div:last-of-type i {
    display: inline-block;
    width: 18px;
    height: 15px;
    background-image: url(../images/iconsb.png);
    background-repeat: no-repeat;
    background-position: -40px 0px;
}

header .header-top .warp-center .top-right div:last-of-type input:focus+i {
    background-image: url(../images/iconsb.png);
    background-repeat: no-repeat;
    background-position: -56px 0px;
}


/*nav 导航栏*/

header nav {
    height: 84px;
    width: 100%;
}

nav .nav-center-warp {
    height: 100%;
    width: 1150px;
    margin: 0 auto;
}

nav .logo {
    float: left;
    width: 170px;
    height: 46px;
    background-image: url(../images/logo_170x46.png);
    /*line-height: 84px;*/
    margin: 20px 38px 0 0;
}

nav .nav-img-warp {
    float: left;
    width: 800px;
}

nav .nav-img-warp li {
    float: left;
    width: 108px;
    height: 84px;
}

nav .nav-img-warp li a {
    display: block;
    width: 108px;
    height: 84px;
}

nav .nav-img-warp div {
    overflow: hidden;
    float: left;
    background-image: url(../images/header.png);
    background-position: 0px -80px;
    background-repeat: no-repeat;
    padding-left: 40px;
}

nav .nav-img-warp .nav-img-left li:nth-child(1) a {
    background-image: url(../images/header.png);
    background-position: -5px -173px;
}
nav .nav-img-warp .nav-img-left li:nth-child(1) a:hover {
    background-image: url(../images/header.png);
    background-position: -113px -173px;
}


nav .nav-img-warp .nav-img-left li:nth-child(2) a {
    background-image: url(../images/header.png);
    background-position: -5px -257px;
}
nav .nav-img-warp .nav-img-left li:nth-child(2) a:hover {
    background-image: url(../images/header.png);
    background-position: -113px -257px;
}

nav .nav-img-warp .nav-img-center li:nth-child(1) a {
    background-image: url(../images/header.png);
    background-position: -5px -341px;
}
nav .nav-img-warp .nav-img-center li:nth-child(1) a:hover {
    background-image: url(../images/header.png);
    background-position: -113px -341px;
}

nav .nav-img-warp .nav-img-right li:nth-child(1) a {
    background-image: url(../images/header.png);
    background-position: -5px -425px;
}
nav .nav-img-warp .nav-img-right li:nth-child(1) a:hover {
    background-image: url(../images/header.png);
    background-position: -113px -425px;
}

nav .nav-img-warp .nav-img-right li:nth-child(2) a {
    background-image: url(../images/header.png);
    background-position: -5px -508px;
}
nav .nav-img-warp .nav-img-right li:nth-child(2) a:hover {
    background-image: url(../images/header.png);
    background-position: -113px -508px;
}

nav .nav-img-warp .nav-img-right li:nth-child(3) a {
    background-image: url(../images/header.png);
    background-position: -5px -591px;
}
nav .nav-img-warp .nav-img-right li:nth-child(3) a:hover {
    background-image: url(../images/header.png);
    background-position: -113px -591px;
}

nav .nav-img-left li:nth-child(1) a i {
    float: left;
    width: 38px;
    height: 30px;
    background-image: url(../images/header.png);
    background-position: 0px -670px;
    transform: translate( -12px, -6px);
    transition: all 0.6s ease;
}
nav .nav-img-warp .nav-img-left:hover>li a i{
  background-image: url(../images/header.png);
  background-position: -40px -670px;
  width: 70px;

}

nav .nav-img-center li a i {
    float: left;
    width: 38px;
    height: 30px;
    background-image: url(../images/header.png);
    background-position: -109px -670px;
    transform: translate( -12px, -6px);
}
nav .nav-img-center:hover>li a i {
  background-image: url(../images/header.png);
  background-position: -149px -670px;
  width: 68px;


}


/*右边的登陆图标*/

nav .nav-icon {
    float: left;
}
nav .nav-icon-pos{
  margin-top: 31px;

}
nav .nav-icon-pos li{
  margin: 0 8px 0 8px;
  

}

nav .nav-icon li {
    float: left;
    width: 25px;
    height: 25px;
    cursor: pointer;
    transition: all 0.6s ease;
}

nav .nav-icon li:nth-child(1) {
    background-image: url(../images/iconsb.png);
    background-position: 1px -20px;
}

nav .nav-icon li:nth-child(1):hover {
    background-image: url(../images/iconsb.png);
    background-position: 1px -45px;
}

nav .nav-icon li:nth-child(2) {
    background-image: url(../images/iconsb.png);
    background-position: -23px -20px;
}

nav .nav-icon li:nth-child(2):hover {
    background-image: url(../images/iconsb.png);
    background-position: -23px -45px;
}

nav .nav-icon li:nth-child(3) {
    background-image: url(../images/iconsb.png);
    background-position: -47px -20px;
}

nav .nav-icon li:nth-child(3):hover {
    background-image: url(../images/iconsb.png);
    background-position: -47px -45px;
}
